import {Component, OnInit} from '@angular/core';
import {FormGroup, FormControl, FormBuilder, Validators} from "@angular/forms";
import {ActivatedRoute, Params} from "@angular/router";

@Component({
  selector: 'app-hello',
  templateUrl: './hello.component.html',
  styleUrls: ['./hello.component.scss']
})
export class HelloComponent implements OnInit{

  name:string = 'joe';
  dateStr:Date = new Date();
  box:string = 'box';
  h3Dom:boolean = true;
  isActive:boolean = false;
  disF:boolean = false;
  colors:Array<string> = ['red', 'blue', 'yellow', 'green'];
  type:number = 2;
  title:string = '';

  age:FormControl = new FormControl();

  loginForm:FormGroup = new FormGroup({
    userName: new FormControl(''),
    password: new FormControl()
  });

  constructor(private fb:FormBuilder,
              private routerinfo:ActivatedRoute){

  }

  validateForm:FormGroup = this.fb.group({
    userName:['',[
      Validators.required,
      Validators.maxLength(18),
      Validators.minLength(6)
    ]],
    passWord:['',[this.passWordValidate]],
    phone:['',[this.phoneValidate]]
  });

  passWordValidate(password:FormControl):object{
    let value = password.value;
    if(!value){
      return {msg:'请输入密码'}
    }else{
      const validate = value.match(/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9a-zA-Z]{6,20}$/);
      return validate?{}:{msg:'密码格式不正确'};
    }
  }

  phoneValidate(phoneval:FormControl):object{
    let value=phoneval.value;
    if(!value){
      return {msg:'请输入手机号'};
    }else{
      const validate = value.match(/[0-9]{11}/);
      return validate?{}:{msg:'手机号格式不正确'};
    }
  }

  submitValidate(){
    console.log(this.validateForm);
  }


  ngOnInit(): void {
    console.log(this.routerinfo.snapshot.queryParams);
    this.routerinfo.params.subscribe((params:Params)=>{
      console.log(params);
      // this.name = params['name'];
    })
  }

  inChange(e:any){
    console.log(e.target.value);
    alert(e.target.value);
  }

  clickFun(e:Event){
    console.log(e);
    alert('触发了');
  }

  getUserName(n:string){
    console.log(n);
  }

  ageChange(){
    this.age.setValue(18);
  }

  submitForm(){
    console.log(this.loginForm.value)
  }

  formData={
    name:'',
    password:''
  };

  submitFun(){
    console.log(this.formData);
  }


}

